<!--
 * @Author: 贺楠 1071780426@qq.com
 * @Date: 2024-05-21 12:58:02
 * @LastEditors: 贺楠 1071780426@qq.com
 * @LastEditTime: 2024-05-21 14:43:53
 * @FilePath: \newMould_BHZ\src\components\HntManage\identify\index.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <!-- 小弹框 width:500,height:0.3,top:15%  -->
  <!-- 中弹框 width:800,height:0.5,top:10% -->

  <!-- 大弹框 width:1060,height:0.76,top:5% -->

  <div class="Control-1 mechanism_dialogS closure" id="comcn small">
    <el-dialog
      width="1060px"
      title="查看"
      v-dialogDrag
      :visible.sync="visible"
      @close="closeDialog"
      :append-to-body="true"
      top="5%"
    >
      <div
        class="dialogBody common commonClassDialog moduleDialog"
        id="longLable"
        :style="{ height: dialogHeight }"
        style="width: 100%"
      >
        <div class="baseTitle">基本信息</div>
        <div style="height: 110px">
          <publicForm
            ref="publicForm"
            lableWidth="95px"
            :formObj="formObj"
            :formData="baseData"
          >
          </publicForm>
        </div>
        <div class="baseTitle">材料用量</div>
        <div
          style="height: 430px; margin-top: 8px"
          id="materialPage"
          class="levelClass materialClass Multi_level_header"
        >
          <el-table
            v-if="isShow"
            stripe
            width="100%"
            min-height="320"
            height="92%"
            :data="tableData"
            style="width: 99%"
          >
            <el-table-column
              type="index"
              :index="indexMethod"
              label="序号"
              width="55"
              align="center"
            />

            <el-table-column
              prop="F_DischargeDates"
              label="出料时间"
              width="150"
              align="center"
            >
            </el-table-column>
            <el-table-column
              label="设计重量值(kg)/实际称量值(kg)/重量偏差(%)"
              align="center"
            >
              <el-table-column
                prop="province"
                label="水"
                width="60"
                align="center"
              >
                <template slot-scope="scope">
                  <div class="lineBoxhidden">
                    <div>{{ scope.row.F_WaterDesignValue }}</div>
                    <div>{{ scope.row.F_WaterActualValue }}</div>
                    <div :class="'bgwarn' + scope.row.F_WaterWarningLevel">
                      {{ scope.row.F_WaterDeviateValue }}
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column
                prop="zip"
                label="水泥1"
                width="60"
                align="center"
              >
                <template slot-scope="scope">
                  <div class="lineBoxhidden">
                    <div>{{ scope.row.F_Cement1DesignValue }}</div>
                    <div>{{ scope.row.F_Cement1ActualValue }}</div>
                    <div :class="'bgwarn' + scope.row.F_Cement1WarningLevel">
                      {{ scope.row.F_Cement1DeviateValue }}
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column
                prop="city"
                label="水泥2"
                width="60"
                align="center"
              >
                <template slot-scope="scope">
                  <div class="lineBoxhidden">
                    <div>{{ scope.row.F_Cement2DesignValue }}</div>
                    <div>{{ scope.row.F_Cement2ActualValue }}</div>
                    <div :class="'bgwarn' + scope.row.F_Cement2WarningLevel">
                      {{ scope.row.F_Cement2DeviateValue }}
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column
                prop="zip"
                :label="aggregateData[0]"
                width="60"
                align="center"
              >
                <template slot-scope="scope">
                  <div class="lineBoxhidden">
                    <div>{{ scope.row.F_Aggregate1DesignValue }}</div>
                    <div>{{ scope.row.F_Aggregate1ActualValue }}</div>
                    <div :class="'bgwarn' + scope.row.F_Aggregate1WarningLevel">
                      {{ scope.row.F_Aggregate1DeviateValue }}
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column
                prop="province"
                :label="aggregateData[1]"
                width="60"
                align="center"
              >
                <template slot-scope="scope">
                  <div class="lineBoxhidden">
                    <div>{{ scope.row.F_Aggregate2DesignValue }}</div>
                    <div>{{ scope.row.F_Aggregate2ActualValue }}</div>
                    <div :class="'bgwarn' + scope.row.F_Aggregate2WarningLevel">
                      {{ scope.row.F_Aggregate2DeviateValue }}
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column
                prop="zip"
                :label="aggregateData[2]"
                width="60"
                align="center"
              >
                <template slot-scope="scope">
                  <div class="lineBoxhidden">
                    <div>{{ scope.row.F_Aggregate3DesignValue }}</div>
                    <div>{{ scope.row.F_Aggregate3ActualValue }}</div>
                    <div :class="'bgwarn' + scope.row.F_Aggregate3WarningLevel">
                      {{ scope.row.F_Aggregate3DeviateValue }}
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column
                prop="city"
                :label="aggregateData[3]"
                width="60"
                align="center"
              >
                <template slot-scope="scope">
                  <div class="lineBoxhidden">
                    <div>{{ scope.row.F_Aggregate4DesignValue }}</div>
                    <div>{{ scope.row.F_Aggregate4ActualValue }}</div>
                    <div :class="'bgwarn' + scope.row.F_Aggregate4WarningLevel">
                      {{ scope.row.F_Aggregate4DeviateValue }}
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column
                prop="zip"
                :label="aggregateData[4]"
                width="60"
                align="center"
              >
                <template slot-scope="scope">
                  <div class="lineBoxhidden">
                    <div>{{ scope.row.F_Aggregate5DesignValue }}</div>
                    <div>{{ scope.row.F_Aggregate5ActualValue }}</div>
                    <div :class="'bgwarn' + scope.row.F_Aggregate5WarningLevel">
                      {{ scope.row.F_Aggregate5DeviateValue }}
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column
                prop="province"
                label="矿粉"
                width="60"
                align="center"
              >
                <template slot-scope="scope">
                  <div class="lineBoxhidden">
                    <div>{{ scope.row.F_OreDesignValue }}</div>
                    <div>{{ scope.row.F_OreActualValue }}</div>
                    <div :class="'bgwarn' + scope.row.F_OreWarningLevel">
                      {{ scope.row.F_OreDeviateValue }}
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column
                prop="zip"
                label="粉煤灰"
                width="65"
                align="center"
              >
                <template slot-scope="scope">
                  <div class="lineBoxhidden">
                    <div>{{ scope.row.F_FlyashDesignValue }}</div>
                    <div>{{ scope.row.F_FlyashActualValue }}</div>
                    <div :class="'bgwarn' + scope.row.F_FlyashWarningLevel">
                      {{ scope.row.F_FlyashDeviateValue }}
                    </div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column
                prop="city"
                label="外加剂1"
                width="70"
                align="center"
              >
                <template slot-scope="scope">
                  <div class="lineBoxhidden">
                    <div>{{ scope.row.F_Admixture1DesignValue }}</div>
                    <div>{{ scope.row.F_Admixture1ActualValue }}</div>
                    <div>{{ scope.row.F_Admixture1DeviateValue }}</div>
                  </div>
                </template>
              </el-table-column>
              <el-table-column
                prop="zip"
                label="外加剂2"
                width="70"
                align="center"
              >
                <template slot-scope="scope">
                  <div class="lineBoxhidden">
                    <div>{{ scope.row.F_Admixture2DesignValue }}</div>
                    <div>{{ scope.row.F_Admixture2ActualValue }}</div>
                    <div>{{ scope.row.F_Admixture2DeviateValue }}</div>
                  </div>
                </template>
              </el-table-column>
            </el-table-column>
            <el-table-column
              prop="F_ActualCalculation"
              label="实际方量"
              width="70"
              align="center"
            >
            </el-table-column>
          </el-table>

          <div
            class="pagination"
            style="
              display: flex;
              justify-content: space-between;
              padding-top: 6px;
            "
            v-if="navigatepageNums > 1"
          >
            <!--  -->
            <div class="paginationInfo" style="font-size: 12px">
              检索到{{ queryCriteriaData.total }} 条记录 | 显示第
              <span v-if="tableList.page == 1">{{ tableList.page }}</span
              ><span v-else>{{ 4 * (tableList.page - 1) + 1 }}</span>
              <span
                v-if="queryCriteriaData.pages == queryCriteriaData.lastPage"
              >
                -{{ queryCriteriaData.total }}条记录</span
              >
              <span v-else>- {{ 4 * tableList.page }} 条记录</span>
              <!-- - {{ 3 * tableList.page }} 条记录 -->
            </div>
            <el-pagination
              background
              @size-change="handleSizeChange"
              @current-change="handleCurrentChange"
              :current-page="tableList.page"
              :page-size="tableList.pageSize"
              layout="prev, pager, next, jumper"
              :total="queryCriteriaData.total"
            >
            </el-pagination>
          </div>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script src="./index.js"></script>
<style lang="less" scoped>
@import "./index.less";
</style>
